<template>
	<view>
		<view class="padding txbj"></view>
		<uni-section title="手机登录" type="line">
			<view style="padding: 10px;">
				<button type="primary" open-type="getPhoneNumber"
					@getphonenumber="loginByWeixinPhoneNumber">手机号登录</button>
			</view>
		</uni-section>
	</view>
</template>


<script>
	var vk = uni.vk;
	var that;
	export default {
		components: {},
		data() {
			// 页面数据变量
			return {
				wxid: '',
				tzggobj: {
					ankz: false,
					value: ''
				},
				defaultAvatarUrll: 'https://mp-7c5f2fa7-1d2c-41f1-b3dd-1f45e490fd36.cdn.bspapp.com/cloudstorage/4e92a8e6-ab7b-4ce4-a3a7-95755f7f7a09.png',
				options: {},
				watchStr: '',
				userInfo: {},
				hasWeixinAuth: true,
				encryptedKey: "",
				image: "",
				gridBorder: false,
				gridCol: 3,
				modalName: null,
				// init请求返回的数据
				userdata: {},
				data: {

				},
				// 表单请求数据
				form1: {

				},
				scrollTop: 0,
				cuIconList: [{
					cuIcon: 'servicefill',
					color: 'red',
					badge: 0,
					name: '客服'
				}]
			}
		},
		onPageScroll(e) {
			this.scrollTop = e.scrollTop;
		},
		// 监听 - 页面每次【加载时】执行(如：前进)
		async onLoad(options = {}) {
			vk = uni.vk;
			that = this;

			vk.userCenter.code2SessionWeixin({
				data: {
					needCache: true
				},
				success: (data) => {
					this.encryptedKey = data.encryptedKey;
				}
			});
			//console.log(options)
		},
		// 监听 - 页面【首次渲染完成时】执行。注意如果渲染速度快，会在页面进入动画完成前触发
		async onReady() {

			//await this.tzgga();
		},
		// 监听 - 页面每次【显示时】执行(如：前进和返回) (页面每次出现在屏幕上都触发，包括从下级页面点返回露出当前页面)
		onShow() {

		},
		// 监听 - 页面每次【隐藏时】执行(如：返回)
		onHide() {

		},
		// 监听 - 点击右上角转发时
		onShareAppMessage(options) {

		},
		// 函数
		methods: {
			// 使用微信绑定的手机号登录/注册
			async loginByWeixinPhoneNumber(e) {
					let {
						encryptedData,
						iv
					} = e.detail;
					if (!encryptedData || !iv) {
						return false;
					}
					vk.userCenter.loginByWeixinPhoneNumber({
						data: {
							encryptedData,
							iv,
							encryptedKey: this.encryptedKey
						},
						success: (data) => {
							that.userInfo.token1 = data.tokenExpired
							uni.setStorageSync('wxuser_key', that.userInfo.token1);
							try {
								
							} catch (e) {
								// error
							}
						}
					});
					uni.login({
						"provider": "weixin",
						"onlyAuthorize": true, // 微信登录仅请求授权认证
						success: async function(event){
							const {code} = event
							//客户端成功获取授权临时票据（code）,向业务服务器发起登录请求。
							await vk.callFunction({
							  url: 'client/gsxy/xmtdk/pub/xmtdkapi.getxmtopid',
							  title:'请求中...',
							  data:{code:code}
							}).then((data) => {
							  vk.setVuex('$user.userInfo.wx_openid.mp-weixin',data.code2SessionRes.openid);
							}).catch((err) => {});
							vk.navigateBack();
						},
						fail: function (err) {
					        // 登录授权失败
					        // err.code是错误码
					    }
					})
			},
			tzgga() {
				// 回调形式 success fail complete
				return vk.callFunction({
					url: 'client/cw/pub/gsxy-hcapi.getvkGlobalData',
					title: '请求中...',
					data: {
						id: '64a277faf43e6001c1e0aea5'
					}
				}).then((data) => {
					//console.log(data.info)
					this.tzggobj = data.info
				}).catch((err) => {

				});
			},
			xgncytx() {
				vk.navigateTo('/pages_bd/dlyemian/set-user-info');
			},
			btnClick(index, item) {
				//console.log(index)
				//console.log(item)
				if (index == 0) {

				} else if (index == 1) {

				} else if (index == 2) {

				}
			},
			Gridchange(e) {
				this.gridCol = e.detail.value
			},
			showModal(e) {
				this.modalName = e.currentTarget.dataset.target
			}
		},
		// 监听器
		watch: {
			// "$store.state.$user.userlnfo": {
			// 	deep: true, // 如果是对象，需要深度监听设置为 true
			// 	handler: function(newVal, oldVal) {
			// 		this.watchStr = `数据发生变化啦，值从 ${oldVal} 变为 ${newVal}`;
			// 		//console.log(this.watchStr);
			// 	}
			// }
		},
		// 计算属性
		computed: {

		}
	}
</script>
<style lang="scss" scoped>
	.txbj {
		position: relative;
		// width: 100%;
		height: 300rpx;
		background-image: url("https://mp-7c5f2fa7-1d2c-41f1-b3dd-1f45e490fd36.cdn.bspapp.com/cloudstorage/9deb2f65-0652-4509-b440-6889ad3c492b.jpg");
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;

	}

	.txbjc {
		position: absolute;
		left: 45%;
		top: 65%;
		transform: translate(-50%, -50%);
	}
</style>